// app/auth/login/page.jsx
'use client';

import { useState } from 'react';
import { useRouter } from 'next/navigation';
import { ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
import {login} from "../../apis/auth";
import {saveToken} from '@/app/apis/common';
import {removeToken} from "../../apis/common";



export default function LoginPage() {
    const [email, setEmail] = useState('');
    const [password, setPassword] = useState('');
    const router = useRouter();
    const handleSubmit = async (e) => {
        e.preventDefault();
        try {
            const response = await login(email, password);
            const { access_token } = response;
            console.log(response, access_token)
            saveToken(access_token);
            // 你可以在这里处理登录成功后的逻辑，例如保存 token 到本地存储
            router.push('/home/'); // 登录成功后跳转到首页
        } catch (error) {
            console.error('登录请求失败:', error);
            toast.error(error?.message);
        }
    };
    removeToken()
    return (
        <div className="min-h-screen flex items-center justify-center bg-sky-200">
            <div className="bg-white p-6 rounded-2xl shadow-lg max-w-md w-full">
                <h1 className="text-2xl font-bold text-gray-800 mb-4">登录页面</h1>
                <form onSubmit={handleSubmit}>
                    <div className="mb-3">
                        <label htmlFor="emailInput" className="block text-sm font-medium text-gray-700">
                            邮箱地址
                        </label>
                        <input
                            type="text"
                            value={email}
                            onChange={(e) => setEmail(e.target.value)}
                            className="form-control block w-full px-3 py-2 mt-2 text-base text-gray-800 bg-white bg-clip-padding border border-solid border-gray-300 rounded transition ease-in-out m-0 focus:text-gray-700 focus:bg-white focus:border-blue-600 focus:outline-none"
                            id="emailInput"
                            placeholder="name@example.com"
                        />
                    </div>
                    <div className="mb-3">
                        <label htmlFor="passwordInput" className="block text-sm font-medium text-gray-700">
                            密码
                        </label>
                        <input
                            type="password"
                            value={password}
                            onChange={(e) => setPassword(e.target.value)}
                            className="form-control block w-full px-3 py-2 mt-2 text-base text-gray-800 bg-white bg-clip-padding border border-solid border-gray-300 rounded transition ease-in-out m-0 focus:text-gray-700 focus:bg-white focus:border-blue-600 focus:outline-none"
                            id="passwordInput"
                            placeholder="Password"
                        />
                    </div>
                    <button
                        type="submit"
                        className="w-full bg-blue-500 hover:bg-blue-600 text-white py-2 px-4 rounded-lg shadow-md transition-transform hover:shadow-lg"
                    >
                        登录
                    </button>
                </form>
                <ToastContainer />
            </div>
        </div>
    );
}